/* 
退出登录功能
1、给退出按钮绑定点击事件
2、弹出一个确定框来询问用户，是否要退出
3、确定退出
 1、清空本地存储中的token
 2、跳回登录页面
*/
// 1、获取退出的dom元素
const logout = document.querySelector('.logout');
// 获取一级标签dom元素
const topMenuList = document.querySelectorAll('.nav>li>a');
// 获取二级标题标签dom元素
const topLevelTwo = document.querySelectorAll('.nav ul a');
// 获得初始化的dom元素
const initBU = document.querySelector('.init');
// 1.退出功能
logout.addEventListener('click', function (e) {
    if (confirm("你确定要退出吗？")) {
        // 清空本地存储中的token
        localStorage.removeItem("msc90")
        // 跳回登录页面
        location.href = "./login.html"
    }
})
/* 

小结：退出功能
    利用到了本地存储和confirm中的弹出框，和location页面跳转
*/
/* 
左侧一级菜单点击功能
先获取到对应的dom元素，利用循环给每个子元素绑定点击事件，然后设置css样式显示
*/
// 2、给一级菜单每个子元素绑定一个点击事件,显示一级菜单功能
topMenuList.forEach(topA => topA.addEventListener("click", function (e) {
    // 显示
    this.nextElementSibling.classList.toggle("shiw")
    // 缓慢动画
    $(this.nextElementSibling).slideToggle()
}))
/* 
左侧一级菜单点击功能小结：
获取所有的一级菜单的dom元素，注意：css选择器的正确！，然后forEach给每一个子元素绑定一个点击事件
    修改一级菜单下一级兄弟的dom的css样式切换，来做到一个显示或则隐藏
    还得设置一个缓冲的动画，用jq库来实现这个功能

*/
// 3、给二级标题设置一个高亮
topLevelTwo.forEach(topB => topB.addEventListener('click', function (e) {
    // 删除高亮
    document.querySelector('.nav ul a.active').classList.remove("active")
    // 增加高亮
    this.classList.add("active")
}))
/* 
点击二级菜单设置一个高亮
给二级菜单的dom元素用一个循环给每一个字元素绑定一个点击事件来做到一个点击高亮，删除当前的高亮，添加高亮就行

*/
// 4、初始化业务
initBU.addEventListener('click', async function (e) {
    const list = await axios({
        url: "init/data",
        // headers: {
        //     Authorization: localStorage.getItem("msc90")
        // }
    })
    console.log(list);
    // data.message
    if (list.data.code === 0) {
        toastr.success(list.data.message)
    }
})
/* 
初始化业务的小结：
用到了令牌技术和本地读取令牌，token需要在每一次发送请求的时候都携带令牌参数过去，get只能在请求头携带过去。get没有请求体
新增了两个单词，headers,Authorization,携带的令牌属性看文档如果没有就问后端人员
*/
